<!-- 转账 -->
<template>
	<view class="content">
		<view class="zview">
			<view class="zitem">
				<view class="lval">
					<!-- <image class="zimg" src="/static/images/cuowu.png" mode="" /> -->
					<text class="zname">对方账号</text>
				</view>
				<u-input v-model="mobile" type="text" :border="false" placeholder="请输入对方手机号"/>
			</view>
			<view class="zitem">
				<view class="lval">
					<!-- <image class="zimg" src="/static/images/cuowu.png" mode="" /> -->
					<text class="zname">转账类型</text>
				</view>
				<view class="zlei">
					<view class="leiitem">
						<u-radio-group v-model="value" active-color="rgba(234,64,26,1)" @change="radioGroupChange">
							<u-radio 
								@change="radioChange" 
								v-for="(item, index) in list" :key="index" 
								:name="item.name"
								:disabled="item.disabled"
							>
								{{item.name}}
							</u-radio>
						</u-radio-group>
					</view>
				</view>
			</view>
			<view class="zitem">
				<view class="lval">
					<!-- <image class="zimg" src="/static/images/cuowu.png" mode="" /> -->
					<text class="zname">备注</text>
				</view>
				<u-input v-model="des" type="text" :border="false" placeholder="转账备注"/>
			</view>
			<view class="zitem" style="display: flex;flex-direction: column;align-items: flex-start;">
				<view class="lval">
					<!-- <image class="zimg" src="/static/images/cuowu.png" mode="" /> -->
					<text class="zname">转账金额</text>
				</view>
				<u-input v-model="money" style="width: 100%;margin-top: 10rpx;" type="text" :border="false" placeholder="请输入金额"/>
			</view>
		</view>
		<view class="tijiao" @click="gettijiao">提交</view>
	</view>
</template>

<script>
	import { mapState, mapActions, mapGetters } from 'vuex';
	export default {
		components: {},
		data() {
			return {
				account:'',
				list: [
					{
						name: '易货额',
						disabled: false
					},
					{
						name: '现金',
						disabled: false
					}
				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				value: '易货额',
				type:'money',//money 易货额度 price 现金
				mobile:'',
				des:'',
				money:''
			};
		},
		computed: {
		},
		onShow() {
		},
		onLoad(option){
			console.log(option)
			// 假设你有一个被编码的字符串
			// 使用示例
			// let encodedStr = 'type=money&mobile=15839170759';
			
			// var goodsId=object.goodsId;
			// let decodedStr = htmlspecialchars_decode(encodedStr);
			
			// console.log(decodedStr); // 输出: This is a test string with special characters!
			// let encodedString = 'type%253Dmoney%2526mobile%253D15839170759';
			
			// // 使用 decodeURIComponent 解码字符串
			// let decodedString = decodeURIComponent(encodedString);
			
			// console.log(decodedString); // 输出: This is a test s
 
			// console.log(JSON.parse(decodeURIComponent(option.scene)))
			if(option.scene){
				let str = option.scene;
				let regex = /%253D/g; // 使用正则表达式并设置全局标志g
				let newStr = str.replace(regex, "="); // 替换所有的"World"为"Earth"
				
				let regexs = /%2526/g; // 使用正则表达式并设置全局标志g
				let newStrs = newStr.replace(regexs, "&"); // 替换所有的"World"为"Earth"

				console.log(newStrs); // 输出: Hello, Earth! Earth is beautiful.
				let b = newStrs.split('&')
				// console.log(b)
				var object={};
				for(var i=0;i<b.length;i++){
					var list2=b[i].split("=");
					object[list2[0]]=list2[1];
				}
				if(object.type){
					
					this.type = object.type
					if(this.type == 'money'){
						this.value = '易货额'
					}else if(this.type == 'price'){
						this.value = '现金'
					}
					console.log(this.type)
				}
				if(object.mobile){
					this.mobile = object.mobile
				}
			}
			// const strnew = newStrs;
			// const params = new URLSearchParams(strnew);

			// const typeValue = params.get('type');
			// const mobileValue = params.get('mobile');

			// console.log(`type 的值为：${typeValue}`);
			// // console.log(`mobile 的值为：15839170759`);
			// if(`${typeValue}`){
			// 	this.type = `${typeValue}`
			// 	if(this.type == 'money'){
			// 		this.value = '易货额'
			// 	}else if(this.type == 'price'){
			// 		this.value = '现金'
			// 	}
			// }
			// if(`${mobileValue}`){
			// 	this.mobile = `${mobileValue}`
			// }
		},
		// 触底加载更多
		onReachBottom() {
		},
		methods: {
			htmlspecialchars_decode(str) {
			return decodeURIComponent((str + '').replace(/%(?!\d{2})/g, encodeURIComponent));
			},
			gettijiao() {
				let that = this;
				// let type = this.type
				if(this.value = '易货额'){
					this.type = 'money'
				}else if(this.value = '现金'){
					this.type = 'price'
				}
				that.$http('home.zhuanzhang', {
					type: this.type,
					mobile: that.mobile,
					des: that.des,
					money: that.money
				}).then(res => {
					if (res.code === 1) {
						
					}
				});
			},
			// 选中某个单选框时，由radio时触发
			radioChange(e) {
				// console.log(e);
			},
			// 选中任一radio时，由radio-group触发
			radioGroupChange(e) {
				// console.log(e);
			}
		}
	};
</script>

<style lang="scss" scoped>
	// 钱包记录
	.content {
		.zview{
			margin: 30rpx;
			border-radius: 10rpx;
			background-color: #fff;
			padding: 10rpx 30rpx;
			
			.zitem{
				display: flex;
				flex-direction: row;
				align-items: center;
				padding: 20rpx 0;
				border-bottom: 1rpx solid #eee;
			}
			.zimg{
				width: 35rpx;
				height: 35rpx;
				margin-right: 8rpx;
			}
			.zname{
				color: #333;
				font-size: 30rpx;
				font-weight: normal;
				display: inline-block;
				margin-right: 10rpx;
			}
		}
		.lval{
			width: 180rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
		}
	}
	.tijiao{
		margin: 50rpx 30rpx;
		height: 80rpx;
		background-color:#ff6d00;
		display: flex;
		align-items: center;
		justify-content: center;
		color: #fff;
		font-size: 30rpx;
		font-weight: normal;
		border-radius: 10rpx;
	}
</style>
